<div class="bjui-pageContent">
    <form id="device-add" class="form-horizontal" method="post"  action='/devices/edit'>
        <input type="hidden" value="0" name="isadd" id="device-isadd">
        <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label"><span class="required-span">*</span>设备SN:
                 
            </label>
            <div class="col-lg-12 col-sm-12">
                <input type="text" class="form-control input-nm" id="device-sn" name="sn">
            </div>
        </div>
        <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label"><span class="required-span">*</span>设备名称:
                 
            </label>
            <div class="col-lg-12 col-sm-12">
                <input type="text" class="form-control input-nm" id="device-name" name="name">
            </div>
        </div>
        
        <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label">所属业务名称:
            </label>
            <div class="col-lg-12 col-sm-12">
                <select class="selectpicker show-tick form-control input-nm" id="device-businessid"  name="businessid" >
                  <option value=""  selected  style = 'display：none;'>请选择业务名称</option>
                  <!-- <option value="">Null</option> -->
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label">IMEI:
            </label>
            <div class="col-lg-12 col-sm-12">
                <input type="text" class="form-control input-nm" name="imei" id="device-imei">
            </div>
        </div>
        <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label">IMSI:
            </label>
            <div class="col-lg-12 col-sm-12">
                <input type="text" class="form-control input-nm" name="imsi" id="device-imsi">
            </div>
        </div>
        <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label">位置:
            </label>
            <div class="col-lg-12 col-sm-12">
                <input type="text" class="form-control input-nm" name="location" id="device-location">
                <span style="color: #FB5651;margin-top: 4px;display: inline-block; font-size: 12px;">位置格式：**省**市**区濂水路7号闽江世纪城A区6栋503</span>
            </div>
        </div>
         <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label">坐标:
            </label>
            <div class="col-lg-12 col-sm-12">
                <input type="text" class="form-control input-nm" name="coordinate" id="device-coordinate">
                <span style="color: #FB5651;margin-top: 4px;display: inline-block; font-size: 12px;">坐标格式：119.302895,26.083804 其中119.302895代表经度,26.083804代表纬度</span>
            </div>
        </div>
        {{#if deviceSn}}
         <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label">COAP设备ID:
            </label>
            <div class="col-lg-12 col-sm-12">
                <input type="text" class="form-control input-nm" name="coapid" id="device-coapid">
            </div>
        </div>
         <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label">COAP加密码:
            </label>
            <div class="col-lg-12 col-sm-12">
                <input type="text" class="form-control input-nm" name="coappsk" id="device-coappsk">
            </div>
        </div>
        {{/if}}
        <div class="form-group" style="height: 72px;">
            <label class="col-lg-12 col-sm-12 control-label">入网方式:
            </label>
            <div class="col-lg-12 col-sm-12">
               <select class="selectpicker show-tick form-control" name="netwayid" id="device-netwayid">
                    <option value=""  selected  style = 'display：none;' >请选择入网方式</option>
                    <!-- <option value="" >Null</option> -->
                </select>
            </div>
        </div>
       
        <div class="form-group">
            <label class="col-lg-12 col-sm-12 control-label">设备描述:
            </label>
            <div class="col-lg-12 col-sm-12">
                 <textarea  style="width: 100%;height: 100px;" name="info" id="device-info-textarea"></textarea>
            </div>
        </div>
       
    </form>
</div>

<div class="btns-group bjui-pageFooter">
    <button type="button" class="close-btn">取消</button>
    <button type="submit" class="save-btn">保存</button>
</div>
<script type="text/javascript">
$(function(){
    var sn="{{deviceSn}}";
    var id="{{userId}}";
    $('.selectpicker').selectpicker();//初始化
    dialog_close();
    if(sn){
        $("#device-isadd").val(1);
        get_business_list(id);
        
    }else{
        get_business_list();
    }
    get_netway_list();
    $('#device-add')
        .formValidation({
            trigger:'blur',
            icon: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                sn: {
                    validators: {
                        notEmpty: {
                            message: '请填写设备SN'
                        },
                        regexp: {
                            regexp: /^[a-zA-Z0-9]{0,12}$/,
                            message: 'SN只能由字母、数字组成,长度不得超过12个字符'
                        }
                    }
                },
                name: {
                    validators: {
                        notEmpty: {
                            message: '请填写设备名称'
                        },
                        regexp: {
                            regexp: /^[\u4e00-\u9fa5_.a-zA-Z0-9-]{2,30}$/,
                            message: '设备名称只能由字母、数字、中文、点、下划线点和减号组成,长度必须2到30之间'
                        }
                    }
                },
                imsi: {
                    validators: {
                        regexp: {
                            regexp: /^(4600[0,1,2,3,5,6,7]|46020)\d{10}$/,
                            message: 'IMSI输入错误'
                        }
                    }
                },
                imei: {
                    validators: {
                        imei: {
                            message: 'IMEI输入错误'
                        }
                    }
                },
                location: {
                    validators: {
                        regexp: {
                            regexp:  /^[\u4e00-\u9fa5_a-zA-Z0-9-]+$/,
                            message: '位置只能由字母、数字和中文组成'
                        }
                    }
                },
                coordinate: {
                    validators: {
                        regexp: {
                            regexp: /^\d+(\.\d+)\,\d+(\.\d+)$/,
                            message: '坐标输入错误'
                        }
                    }
                },
                info:{
                    validators: {
                        stringLength:{
                          message:'设备描述不得超过200个字符',
                          max:200
                        }
                    }
                } 
            }
        })
        .on('success.form.fv', function(e) {
            // Prevent form submission
            e.preventDefault();

            // Get the form instance
            var $form = $(e.target);

            // Get the FormValidation instance
            var bv = $form.data('formValidation');

            // Use Ajax to submit form data
            $.post($form.attr('action'), $form.serialize(), function(result) {
                if(result.statusCode=='200'){
                    BJUI.alertmsg('ok',result.message);
                    BJUI.dialog('closeCurrent');
                    BJUI.navtab('refresh', 'sysdevice');
                }else{
                    BJUI.alertmsg('info',result.message);
                }
            }, 'json');
        }); 
})
function get_business_list(id){
    var sn="{{deviceSn}}";
    $.ajax({
        url:"/devices/getBusinessList",
        type:"post",
        data:{'userid':id},
        dataType:"json",
        success:function(data){
            if(data.statusCode=='200'){
                $.each(data.list,function(i,item){
                    $("#device-businessid").append('<option value="'+item.id+'" >'+item.name+'</option>')
                })
                $("#device-businessid").selectpicker('render');
                $("#device-businessid").selectpicker('refresh');
                if(sn){
                    getDeviceInfo(sn);
                }
            }
        }
    })
}
function get_netway_list(){
     $.ajax({
        url:"/devices/getNetwayList",
        type:"post",
        dataType:"json",
        success:function(data){
            if(data.statusCode=='200'){
                $.each(data.list,function(i,item){
                    $("#device-netwayid").append('<option value="'+item.id+'" >'+item.name+'</option>')
                })
                $("#device-netwayid").selectpicker('render');
                $("#device-netwayid").selectpicker('refresh');
            }
        }
    })
}


function getDeviceInfo(sn){
    $.ajax({
        url:"/devices/getDeviceInfo",
        type:"post",
        data:{"sn":sn},
        dataType:"JSON",
        success:function(json){
            $("#device-sn").val(json.data.sn).attr('readonly','readonly');
            $("#device-name").val(json.data.name);
            $("#device-businessid").val(json.data.businessid); 
            $('#device-businessid').selectpicker('render');
            $("#device-imsi").val(json.data.imsi);
            $("#device-imei").val(json.data.imei);
            $("#device-coapid").val(json.data.coapdeviceid)
            $("#device-coappsk").val(json.data.coappsk);
            $("#device-location").val(json.data.location);
            $("#device-coordinate").val(json.data.coordinate);
            $("#device-netwayid").val( json.data.netwayid); 
            $('#device-netwayid').selectpicker('render');
            $("#device-info-textarea").val(json.data.info);
        }
    })
}
</script>